import React from 'react'
import { NavLink } from 'react-router-dom'

export default function Navigation() {
  function computedClassName({isActive}){
    return isActive?'list-group-item atguigu':'list-group-item'
  }
  return (
    <div className="col-xs-2 col-xs-offset-2">
        <div className="list-group">
        {/*路由链接 list-group-item atguigu*/}
        <NavLink className={computedClassName} to="/about">About</NavLink>
        <NavLink className={computedClassName}  to="/home">Home</NavLink>
        </div>
    </div>
  )
}
